import { mapState } from 'vuex';

export default {
  watch: {
    // 监听 total 的变化
    total(newVal, oldVal) {
      // 当 total 发生变化时，调用 setBadge 方法
      this.setBadge();
    },
  },
  computed: {
    // 从 Vuex 中映射 total 状态
    ...mapState('m_mess', ['total']),
  },
  onShow() {
    // 页面显示时调用 setBadge 方法
    this.setBadge();
  },
  methods: {
    setBadge() {
      if (this.total === 0) {
        // 当数量为 0 时，移除角标
        uni.removeTabBarBadge({
          index: 3,
        });
      } else {
        // 当数量大于 0 时，显示角标
        uni.setTabBarBadge({
          index: 3,
          text: this.total + '', // 转换为字符串
        });
      }
    },
  },
};